<template>
  <div class="content-box">
    <nav-title title="招聘录用审批" :routerLink="routerLink"/>
    <!-- 发起人基本信息 -->
    <div class="regulations-box">
      <div class="title">发起人基本信息</div>
      <div class="information">
        <p class="info-cell clearfix">
          <label class="label">姓名</label>
          <span class="value" style="font-size: 14px;" >{{allInfo.cWfName}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">部门</label>
          <span class="value">{{allInfo.cWfDeptdescr}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">岗位</label>
          <span class="value">{{allInfo.cWfJcDescr}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">联系电话</label>
          <span class="value">{{allInfo.cWfPhone}}</span>
        </p>
      </div>
    </div>
    <!-- 应聘者信息 -->
    <div class="regulations-box">
      <div class="title">应聘者信息</div>
      <div class="information">
        <p class="info-cell clearfix">
          <label class="label">应聘者ID</label>
          <span class="value">{{allInfo.deptid}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">应聘者姓名</label>
          <span class="value">{{allInfo.nameDescr}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">性别</label>
          <span class="value">{{allInfo.sexValue}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">出生日期</label>
          <span class="value">{{allInfo.birthdate}}</span>
        </p>

        <p class="info-cell clearfix">
          <label class="label">婚姻状况</label>
          <span class="value">{{allInfo.marStatusValue}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">生育情况</label>
          <span class="value">{{allInfo.cBearValue}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">拟录用部门</label>
          <span class="value">{{allInfo.detpDescr}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">拟录用岗位</label>
          <span class="value">
            <input type="text" placeholder="请填写..." v-model="allInfo.jobcodeDescr">
          </span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">拟入职职等</label>
          <span class="value">{{allInfo.rsJobLevel}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">实有人数/部门编制</label>
          <span class="value">{{allInfo.cDeptHcRate}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">拟入职日期</label>
          <span class="value">{{allInfo.hireDt}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">社保缴纳地</label>
          <span class="value">{{allInfo.rsSilCd}}</span>
        </p>
        <p class="info-cell clearfix" v-for="authFiled in authFileds" v-if="authFiled.isDisplay == true">
          <label class="label" v-if="authFiled.fieldKey == 'cAdjuSalary' "><span class="red">*</span>月固薪</label>
          <label class="label" v-else=""><span class="red">*</span>年薪</label>
          <!-- <label class="label"><span class="red">*</span>月固薪</label> -->
          <span class="value">
            <input type="text" v-if="authFiled.isEdit == true" placeholder="请填写..." v-model="authFiled.fieldValue">
            <input type="text" v-else="" readonly v-model="authFiled.fieldValue">
          </span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">薪资备注说明</label>
          <span class="value">{{allInfo.cSalaryComments}}</span>
        </p>
      </div>
    </div>
    <!-- 应聘者工作经历 -->
    <div class="regulations-box">
      <div class="title">应聘者工作经历</div>
      <ul class="formal">

        <li v-for="aptWork in aptWorks" >
          <div class="neirong">
            <div class="yuan"></div>
            <div class="con">{{aptWork.startDate}} - {{aptWork.endDate}}</div>
            <div class="clearfix timer">
              <div class="con clearfix">{{aptWork.companyDescr}}</div>
              <div class="con clearfix">{{aptWork.positionDescr}}</div>
            </div>
          </div>
        </li>
      </ul>
    </div>
    <!-- 应聘者教育经历 -->
    <div class="regulations-box">
      <div class="title">应聘者教育经历</div>
      <ul class="formal">

        <li v-for="aptEdu in aptEdus">
          <div class="neirong">
            <div class="yuan"></div>
            <div class="con">{{aptEdu.startDate}} - {{aptEdu.endDate}}</div>
            <div class="clearfix timer">
              <div class="con clearfix">{{aptEdu.school}}</div>
              <div class="con clearfix">{{aptEdu.major}}</div>
              <div class="con clearfix">{{aptEdu.cEducitonValue}}|{{aptEdu.cDegreeValue}}</div>
            </div>
          </div>
        </li>
      </ul>
    </div>
    <!-- 应聘者面试信息 -->
    <div class="regulations-box">
      <div class="title">应聘者面试信息</div>
      <div class="information">
        <p class="info-cell clearfix">
          <label class="label">面试小结</label>
          <span class="value">{{allInfo.cIntrvwSumry}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">面试官</label>
          <span class="value">{{allInfo.cInterviewer}}</span>
        </p>
        <p class="info-cell clearfix">
          <label class="label">招聘信息来源</label>
          <span class="value">{{allInfo.cRecruitSourceValue}}</span>
        </p>
      </div>
    </div>
    <!-- 流程图 -->
    <div class="regulations-box">
      <div class="title">流程图</div>
      <!-- 流程图 -->
      <v-flow-charts :transNum="cTransactionNbr"></v-flow-charts>
    </div>
    <!-- 审批意见 -->
    <div class="regulations-box">
      <div class="info-label">审批意见</div>
      <div class="info-label-text">
        <!-- <textarea rows="5" placeholder="请填写..." ></textarea> -->
        <textarea v-if="approved == '0'" placeholder="请在这里输入..." rows="5" v-model="cComments"></textarea>
        <textarea v-else="" readonly rows="5" v-model="cComments"></textarea>
      </div>
    </div>

    <div style="height: 50px"></div>
    <!-- 底部按钮 -->
    <div v-if="approved == '0'">
      <div class="fix-btn">
      <button v-if="allInfo.cApprovalSw == 'Y'" class="blue-btn" @click="doOperate('Approval')">同意</button>
      <button v-if="allInfo.cAddSw == 'Y'" class="white-btn" @click="doOperate('AddStep')">
        <span>+</span> 加签</button>
      <span v-if="allInfo.cPushbackAllSw == 'Y'" class="reject-main">
        <button class="yellow-btn" @click="popGroup">驳回</button>
        <transition name="slide-fade">
          <span v-if="showGroup" class="reject-group">
            <button class="yellow-btn" @click="doOperate('PushAllback')">重走</button>
            <button class="yellow-btn" @click="doOperate('Pushback')">不重走</button>
          </span>
        </transition>
      </span>
    </div>
    </div>
  </div>
</template>
<script>
import { dateFormat } from "vux";
import { getRecruitmentInfo, getRecruitmentApproveDrft } from "../../api/api";
import operationBtn from "./common/operationBtn";
import vFlowCharts from "../formalStaff/common/flowChart";
import { json2Form } from '../../util/http';

export default {
  components: {
    operationBtn,
    dateFormat,
    vFlowCharts
  },

  created() {
    this.cTransactionNbr = this.$route.query.cTransactionNbr;
    this.approved = this.$route.query.approved;
    if (this.$route.query.approved == '0') {
      this.routerLink = 'TodoList'
    } else if (this.$route.query.approved == '1') {
      this.routerLink = 'DoneList'
    } else {
      this.routerLink = 'MyApplication'
    }
    this.getData();
  },
  mounted() {},
  data() {
    return {
      routerLink: "",
      allInfo: {},
      aptWorks: [],
      aptEdus: [],
      cComments: "",
      authFileds: [],
      showGroup: false,
    };
  },
  methods: {
    getData() {
      getRecruitmentInfo({ cTransactionNbr: this.cTransactionNbr })
        .then(res => {
          if (res && res.retCode === "000000") {
            this.allInfo = res.retData;
            this.allInfo.birthdate = dateFormat( new Date(res.retData.birthdate), "DD/MM/YYYY" );
            this.allInfo.hireDt = dateFormat( new Date(res.retData.hireDt), "DD/MM/YYYY" );
            this.aptWorks = res.retData.aptWorks;
            this.aptEdus = res.retData.aptEdus;
            this.authFileds = res.retData.authFileds;
          } else {
            this.$vux.alert.show({
              title: "",
              content: res.retMsg
            });
          }
        })
        .catch(res => {
          this.$vux.alert.show({
            title: "警告",
            content: "网络异常，请稍后重试"
          });
        });
    },
    doOperate(actionType) {
      if (actionType == "PushAllback" || actionType == "Pushback") {
        this.showGroup = !this.showGroup;
      }
      window.event.cancelBubble = true;

      //同意审批
      let cAdjuSalary = '', annualSalary = '';
        this.authFileds.map((item)=>{
          if (item.fieldKey == 'cAdjuSalary') cAdjuSalary = item.fieldValue;
          if (item.fieldKey == 'annualSalary') annualSalary = item.fieldValue;
        });
      let params = {
        'cTransactionNbr': this.cTransactionNbr,
        actionType,
        'comments': this.cComments,
        'addUserIds': '',
        cAdjuSalary,
        annualSalary,
      }

      if (actionType == "AddStep") {
        //加签需要跳转至加签页面，并携带参数
        this.$router.push({
          name: "Visa",
          params: {
            // c_TRANSACTION_NBR: this.cTransactionNbr,
            // c_WF_TYPE: this.allInfo.cWfType,
            // c_COMMENTS: this.cComments,
            // c_Link: "Employment",
            recruitmentParams: params,
          }
        });
      } else {
        getRecruitmentApproveDrft(json2Form(params))
          .then(res => {
            if (res && res.retCode === "000000") {
              let _this = this;
              this.$vux.alert.show({
                title: "成功",
                content: "操作成功",
                onHide() {
                  _this.$router.push("/TodoList");
                }
              });
            } else {
              this.$vux.alert.show({
                title: "",
                content: res.retMsg
              });
            }
          })
          .catch(res => {
            this.$vux.alert.show({
              title: "警告",
              content: "网络异常，请稍后重试"
            });
          });
      }
    },
    popGroup() {
      this.showGroup = !this.showGroup;
      window.event.cancelBubble = true;
    },
  }
};
</script>

<style type="text/scss" lang="scss">
@import "../../styles/staff.scss";
</style>
